/* stylelint-disable scss/at-extend-no-missing-placeholder */
$style-4: (
    'offsetY': 0,
);

@include b('custom-border') {
  @include set-component-css-var(style-4, $style-4);

  @include when(style-4) {
    position: relative;
    width: 100%;
    height: 100%;
    @include e('de-reverse') {
      transform: rotate(180deg);
    }
    @include e('svg-container') {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: calc(100% - getCssVar(style-4,'offsetY'));
  
      & > polyline {
        fill: none;
      }
    }
  
    .sw1 {
      stroke-width: 1;
    }
  
    .sw3 {
      stroke-linecap: round;
      stroke-width: 3px;
    }
  
    .dv-bb4-line-1 {
      @extend .sw1;
    }
  
    .dv-bb4-line-2 {
      @extend .sw1;
    }
  
    .dv-bb4-line-3 {
      @extend .sw3;
    }
  
    .dv-bb4-line-4 {
      @extend .sw3;
    }
  
    .dv-bb4-line-5 {
      @extend .sw1;
    }
  
    .dv-bb4-line-6 {
      @extend .sw1;
    }
  
    .dv-bb4-line-7 {
      @extend .sw1;
    }
  
    .dv-bb4-line-8 {
      @extend .sw3;
    }
  
    .dv-bb4-line-9 {
      @extend .sw3;
  
      stroke-dasharray: 100 250;
    }
  
    .dv-bb4-line-10 {
      @extend .sw1;
  
      stroke-dasharray: 80 270;
    }
  
    @include e('content') {
      position: relative;
      width: 100%;
      height: 100%;
    }
  }
}
